<template>
  <div>
    <div class="nav_title"></div>

    <!-- navigation menu -->
    <div class="header-inner d-flex align-items-start flex-column">

      <a href="http://extraxue.com/">
        <img class="head-icon" src="assets/head-icon.ico" alt="ExtraXue"/>
      </a>
      <a href="http://extraxue.com/" class="site-title dot mt-3">Extra Xue</a>
      <span class="site-slogan">Operator, Developer</span>
      <nav>
        <ul class="vertical-menu scrollspy">
          <li><a href="#home" class="active"><i class="icon-home"></i>Home</a></li>
          <li><a href="#article"><i class="icon-user"></i>Article</a></li>
        </ul>
      </nav>
      <!-- footer -->
      <div class="footer mt-auto">
        <!-- social icons -->
        <ul class="social-icons list-inline">
          <li class="list-inline-item">
            <a href="https://gitee.com/extraxue">
              <i class="fab fa-github"></i>
            </a>
          </li>
          <li class="list-inline-item">
            <a href="https://twitter.com/ExtraXue">
              <i class="fab fa-twitter"></i>
            </a>
          </li>
          <li class="list-inline-item">
            <a href="https://www.instagram.com/extraxue26">
              <i class="fab fa-instagram"></i>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "nav_home"
}
</script>

<style scoped>

</style>